import { FunctionComponent, useState } from "react";
import style from "./index.less";
import { Radio, Button } from "antd";
import { E_GAMELEV_DICT } from "@/enum/dict"
import { EGameLev } from "@/enum"

interface IProps {
    onSelect?: (lev: EGameLev) => void;
}

const GameStart: FunctionComponent<IProps> = (props) => {

    const [lev, setLev] = useState<EGameLev>(EGameLev.SIMPLE);
    const startGame = () => {
        props.onSelect?.(lev);
    }

    return <div className={style.game_start}>
        <div className={style.game_start_title}>
            <p>人工智能（网安方向）231班</p>
            <p>生产性项目实训-3</p>
        </div>
        <div className={style.game_start_lev}>
            <Radio.Group onChange={(e) => setLev(e.target.value)} value={lev}>
                {
                    E_GAMELEV_DICT.map(op => <Radio key={`lev-${op.value}`} value={op.value}>{op.lable}</Radio>)
                }
            </Radio.Group>
        </div>
        <Button block style={{width: "70%"}} type="primary" onClick={startGame}>开始游戏</Button>
    </div>;
};

export default GameStart;
